<link rel="stylesheet" href="__STATIC__/addon/region/region_style.css">
<div class="row">
    <div class="col-md-4 col-xs-12 col-4">
        <select name="province_{$addons_data.name}" id="province_{$addons_data.name}" class="form-control">

        </select>
    </div>
    <div class="col-md-4 col-xs-12 col-4">
        <select name="city_{$addons_data.name}" id="city_{$addons_data.name}" class="form-control">

        </select>
    </div>
    <div class="col-md-4 col-xs-12 col-4">
        <select name="county_{$addons_data.name}" id="county_{$addons_data.name}" class="form-control">
        </select>
    </div>
</div>

<script type="text/javascript">

    $(function () {
        var province_id = "{$addons_data['province']}";
        var city_id = "{$addons_data['city']}";
        var county_id = "{$addons_data['county']}";

        var get_options_url = '{:addons_url("region://Index/getOptions",array("addons_model"=>$addons_data.addons_model))}';

        //alert(get_options_url);
        function changeProvince(province_id = 0, select_id = 0) {
            $.get(get_options_url, {upid: province_id, select_id: select_id, level: 1}, function (result) {
                $("#province_{$addons_data.name}").html(result.data);
            });
        }

        function changeCity(city_id = 0, select_id = 0) {
            $.get(get_options_url, {upid: city_id, select_id: select_id, level: 2}, function (result) {
                $("#city_{$addons_data.name}").html(result.data);
            });
        }

        function changeCounty(county_id = 0, select_id = 0) {
            $.get(get_options_url, {upid: county_id, select_id: select_id, level: 3}, function (result) {
                $("#county_{$addons_data.name}").html(result.data);
            });
        }

        changeProvince(100000, province_id);
        changeCity(province_id, city_id);
        changeCounty(city_id, county_id);

        $("#province_{$addons_data.name}").change(function () {
            changeCity($("#province_{$addons_data.name}").val());
        });
        $("#city_{$addons_data.name}").change(function () {
            changeCounty($("#city_{$addons_data.name}").val());
        });
    });
</script>